<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" type="text/css" href="css/cart.css" />
		<link rel="stylesheet" type="text/css" href="css/base.css" />
		<link rel="stylesheet" type="text/css" href="css/shop_head.css" />
		<script src="js/jquery1.11.0.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/av-min-2.1.2.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/base.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			function init() {
				var APP_ID = 'c4w6bVvWfh8xxcmkBE1G0gIt-gzGzoHsz';
				var APP_KEY = 'JBikg4Ksk76zcTi5BKYWvTJF';
				AV.init({
					appId: APP_ID,
					appKey: APP_KEY
				});
			}
			init();

			(function() {
				var query = new AV.Query('HSJ_cart');
				query.descending('createdAt');
				var user = getidurl("User");
				query.find(user).then(function(products) {
					// 查询到商品后，在前端展示到相应的位置中。
					for(var i = 0; i < products.length; i++) {
						var zongjia = (products[i].attributes.cartprice) * (products[i].attributes.cartnum);
						var tr = "<tr><td class='checkbox'><input class='check-one check' type='checkbox' /></td><td class='goods'><img src=" + products[i].attributes.cartimg + " /><span>" + products[i].attributes.cartname + "</span></td><td class='price'> " + products[i].attributes.cartprice + ".00</td><td class='count'><span class='reduce'></span><input class='count-input' type='text' value=" + products[i].attributes.cartnum + " /><span class='add'>+</span></td><td class='subtotal'> " + zongjia + ".00</td><td class='operation'><span class='delete'>删除</span></td></tr>";
						$("#cartTable>tbody").append(tr);
					}
				}).catch(function(error) {
					console.log(JSON.stringify(error));
				});
			})()

			function getidurl(name) {
				var myurl = location.search;
				var start = myurl.indexOf(name + "=");
				if(start != -1) {
					start = start + name.length + 1;
					var end = myurl.indexOf("&", start);
					if(end == -1) {
						end = myurl.length;
					}
					//转义
					return decodeURI(myurl.substring(start, end));
				}
			}
		</script>
	</head>

	<body>
		<div id="shop_head">
			<div id="base_top_bg">
				<div class="base_top_navDiv">
					<div class="base_top_logo" onclick="location.href='index.html'"></div>
					<ul class="base_top_nav">
						<li class="w42" id="index_dl" onclick="location.href='login.html'">登录</li>
						<li class="w40" id="index_tcdl" onclick="location.href='register.html'"></li>
						<li class="w40" onclick="location.href='shop.html'"></li>
						<li class="w56" onclick="location.href='cart.html'">购物车</li>
						<li></li>
						<li class="w40"></li>
						<li class="w40"></li>
						<li class="w40"></li>
					</ul>
					<div id="base_dlcg"></div>

					<img class="base_weixin" src="img/index/index_weixin1.png" />
					<img class="base_weibo" src="img/index/index_weibo1.png" />
					<img class="base_weitao" src="img/index/index_weitao1.png" />
				</div>
			</div>
			<ul id="base_leftAdd_content">
				<li>
					<a href="news.html">资讯</a>
				</li>
				<li>
					<a href="join.html">加盟</a>
				</li>
				<li>
					<a href="job.html">纳贤</a>
				</li>
				<li>
					<a href="woker.html">匠人</a>
				</li>
				<li>
					<a href="cooperation.html">合作</a>
				</li>
				<li>
					<a href="actor.html">选角</a>
				</li>
				<li>
					<a href="media.html">媒体</a>
				</li>
			</ul>
			<div id="base_leftAdd">
				<span></span>
			</div>
			<!--模拟客服开始-->
			<div id="top"></div>
			<div id="main">
				<span id="base_guanbi"></span>
				<div id="txt">花笙记客服代表</div>
				<div id="show">
					<span class="show_span">很高兴为您服务！</span>
				</div>
				<input type="text" name="text" id="text" value="" />
				<input type="button" style="cursor: pointer;" id="send" value="发送" />
			</div>
			<!--模拟客服结束-->
		</div>
		<!--wwb-->
		<div id="shop_nav">
			<div id="shop_nav_icon">
				<ul id="img_icon">
					<li><span class="zhen"></span><span class="fan"></span></li>
					<li><span class="zhen"></span><span class="fan"></span></li>
					<li><span class="zhen"></span><span class="fan"></span></li>
					<li><span class="zhen"></span><span class="fan"></span></li>
					<li><span class="zhen"></span><span class="fan"></span></li>
					<li><span class="zhen"></span><span class="fan"></span></li>
					<li><span class="zhen"></span><span class="fan"></span></li>
					<li><span class="zhen"></span><span class="fan"></span></li>
				</ul>
				<ul id="font_icon">
					<li><span class="font_zhen"></span><span class="font_fan"></span></li>
					<li><span class="font_zhen"></span><span class="font_fan"></span></li>
					<li><span class="font_zhen"></span><span class="font_fan"></span>
						<ul class="font_icon_list font_icon_list1">
							<li>
								<a><span class="list_zhen"></span><span class="list_fan"></span></a>
							</li>
							<li>
								<a><span class="list_zhen"></span><span class="list_fan"></span></a>
							</li>
							<li>
								<a><span class="list_zhen"></span><span class="list_fan"></span></a>
							</li>
							<li>
								<a><span class="list_zhen"></span><span class="list_fan"></span></a>
							</li>
							<li>
								<a><span class="list_zhen"></span><span class="list_fan"></span></a>
							</li>
							<li>
								<a><span class="list_zhen"></span><span class="list_fan"></span></a>
							</li>
							<li>
								<a><span class="list_zhen"></span><span class="list_fan"></span></a>
							</li>
							<li>
								<a><span class="list_zhen"></span><span class="list_fan"></span></a>
							</li>
							<li>
								<a><span class="list_zhen"></span><span class="list_fan"></span></a>
							</li>
							<li>
								<a><span class="list_zhen"></span><span class="list_fan"></span></a>
							</li>
						</ul>
					</li>
					<li><span class="font_zhen"></span><span class="font_fan"></span>
						<ul class="font_icon_list font_icon_list1">
							<li>
								<a><span class="list_zhen"></span><span class="list_fan"></span></a>
							</li>
							<li>
								<a><span class="list_zhen"></span><span class="list_fan"></span></a>
							</li>
							<li>
								<a><span class="list_zhen"></span><span class="list_fan"></span></a>
							</li>
							<li>
								<a><span class="list_zhen"></span><span class="list_fan"></span></a>
							</li>
							<li>
								<a><span class="list_zhen"></span><span class="list_fan"></span></a>
							</li>
						</ul>
					</li>
					<li><span class="font_zhen"></span><span class="font_fan"></span>
						<ul class="font_icon_list font_icon_list1">
							<li>
								<a><span class="list_zhen"></span><span class="list_fan"></span></a>
							</li>
							<li>
								<a><span class="list_zhen"></span><span class="list_fan"></span></a>
							</li>
							<li>
								<a><span class="list_zhen"></span><span class="list_fan"></span></a>
							</li>
							<li>
								<a><span class="list_zhen"></span><span class="list_fan"></span></a>
							</li>
							<li>
								<a><span class="list_zhen"></span><span class="list_fan"></span></a>
							</li>
						</ul>
					</li>
					<li><span class="font_zhen"></span><span class="font_fan"></span></li>
					<li><span class="font_zhen"></span><span class="font_fan"></span>
						<ul class="font_icon_list font_icon_list2">
							<li>
								<a><span class="list_zhen"></span><span class="list_fan"></span></a>
							</li>
							<li>
								<a><span class="list_zhen"></span><span class="list_fan"></span></a>
							</li>
						</ul>
					</li>
					<li><span class="font_zhen"></span><span class="font_fan"></span>
						<ul class="font_icon_list font_icon_list2">
							<li>
								<a><span class="list_zhen"></span><span class="list_fan"></span></a>
							</li>
							<li>
								<a><span class="list_zhen"></span><span class="list_fan"></span></a>
							</li>
							<li>
								<a><span class="list_zhen"></span><span class="list_fan"></span></a>
							</li>
						</ul>
					</li>
				</ul>
			</div>
		</div>
		<!--购物车-->
		<div class="catbox" style="position: absolute;top: 220px;">
			<table id="cartTable">
				<thead>
					<tr>
						<th>
							<input class="check-all check" type="checkbox" />&nbsp;&nbsp;全选
						</th>
						<th>商品</th>
						<th>单价</th>
						<th>数量</th>
						<th>小计</th>
						<th>操作</th>
					</tr>
				</thead>
				<tbody>
					<!--<tr>
						<td class="checkbox"><input class="check-one check" type="checkbox" /></td>
						<td class="goods"><img src="img/cart/cart_img1.jpg" alt="" /><span>循环纹真丝唐装棉袄</span></td>
						<td class="price">1699.00</td>
						<td class="count"><span class="reduce"></span>
							<input class="count-input" type="text" value="1" />
							<span class="add">+</span></td>
						<td class="subtotal">1699.00</td>
						<td class="operation"><span class="delete">删除</span></td>
					</tr>-->
				</tbody>

			</table>
			<div class="foot" id="foot">
				<label class="fl select-all"><input type="checkbox" class="check-all check"/>&nbsp;&nbsp;全选</label>
				<a class="fl delete" id="deleteAll" href="javascript:;">删除</a>
				<div class="fr closing" onclick="getTotal();">结 算</div>
				<input type="hidden" id="cartTotalPrice" />
				<div class="fr total">合计：￥<span id="priceTotal">0.00</span></div>
				<div class="fr selected" id="selected">已选商品<span id="selectedTotal">0</span>件<span class="arrow up">︽</span><span class="arrow down">︾</span></div>
				<div class="selected-view">
					<div id="selectedViewList" class="clearfix">
						<div><img src="img/cart/cart_img1.jpg"><span>取消选择</span></div>
					</div>
				</div>
			</div>
		</div>
	</body>
	<script src="js/shop_head.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/cart.js" type="text/javascript" charset="utf-8"></script>

</html>